<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <!-- Required meta tags-->
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="au theme template">
    <meta name="author" content="Hau Nguyen">
    <meta name="keywords" content="au theme template">

    <!-- Title Page-->
    <title>订单管理</title>

    <!-- Fontfaces CSS-->
    <link th:href="@{css/font-face.css}" rel="stylesheet" media="all">
    <link th:href="@{vendor/font-awesome-4.7/css/font-awesome.min.css}" rel="stylesheet" media="all">
    <link th:href="@{vendor/font-awesome-5/css/fontawesome-all.min.css}" rel="stylesheet" media="all">
    <link th:href="@{vendor/mdi-font/css/material-design-iconic-font.min.css}" rel="stylesheet" media="all">

    <!-- Bootstrap CSS-->
    <link th:href="@{vendor/bootstrap-4.1/bootstrap.min.css}" rel="stylesheet" media="all">

    <!-- Vendor CSS-->
    <link th:href="@{vendor/animsition/animsition.min.css}" rel="stylesheet" media="all">
    <link th:href="@{vendor/bootstrap-progressbar/bootstrap-progressbar-3.3.4.min.css}" rel="stylesheet" media="all">
    <link th:href="@{vendor/wow/animate.css}" rel="stylesheet" media="all">
    <link th:href="@{vendor/css-hamburgers/hamburgers.min.css}" rel="stylesheet" media="all">
    <link th:href="@{vendor/slick/slick.css}" rel="stylesheet" media="all">
    <link th:href="@{vendor/select2/select2.min.css}" rel="stylesheet" media="all">
    <link th:href="@{vendor/perfect-scrollbar/perfect-scrollbar.css}" rel="stylesheet" media="all">

    <!-- Main CSS-->
    <link th:href="@{css/theme.css}" rel="stylesheet" media="all">
    <style>
        #pic{
            width: 80px;
            height: 70px;
        }
    </style>

</head>
<body class="animsition">
    <div class="page-wrapper">
        <!-- HEADER MOBILE-->
        <header class="header-mobile d-block d-lg-none">
            <div class="header-mobile__bar">
                <div class="container-fluid">
                    <div class="header-mobile-inner">
                        <a class="logo" href="/index">
                            <!-- <img src="images/icon/logo.png" alt="CoolAdmin" /> -->
                            <h1>502畜牧养殖基地管理平台</h1>
                        </a>
                        <button class="hamburger hamburger--slider" type="button">
                            <span class="hamburger-box">
                                <span class="hamburger-inner"></span>
                            </span>
                        </button>
                    </div>
                </div>
            </div>
        </header>
        <!-- END HEADER MOBILE-->

        <!-- MENU SIDEBAR-->
        <aside class="menu-sidebar d-none d-lg-block">
            <div class="logo">
                <a href="index.html">
                    <!-- <img src="images/icon/logo.png" alt="Cool Admin" /> -->
                    <h4>502畜牧养殖基地管理平台</h4>
                </a>
            </div>
            <div class="menu-sidebar__content js-scrollbar1">
                <nav class="navbar-sidebar">
                    <ul class="list-unstyled navbar__list">
                        <li class="has-sub">
                            <a class="js-arrow" href="#">
                                <i class="fa fa-magnet"></i>产品管理</a>
                            <ul class="list-unstyled navbar__sub-list js-sub-list">
                                <li>
                                    <a th:href="@{/selectallproducts}"><i class="fa fa-magnet"></i>产品信息管理</a>
                                </li>
                            </ul>
                        </li>

                        <li class="has-sub">
                            <a class="js-arrow" href="#">
                                <i class="fa fa-cogs"></i>设备管理</a>
                            <ul class="list-unstyled navbar__sub-list js-sub-list">
                                <li>
                                    <a th:href="@{selectallequipment}"><i class="fa fa-cogs"></i>设备信息管理</a>
                                </li>
                                <li>
                                    <a th:href="@{selectallequipmentproduct}"><i class="fa fa-cogs"></i>产品设备信息管理</a>
                                </li>
                            </ul>
                        </li>

                        <li class="has-sub">
                            <a class="js-arrow" href="#">
                                <i class="fa fa-bell"></i>订单管理</a>
                            <ul class="list-unstyled navbar__sub-list js-sub-list">
                                <li>
                                    <a th:href="@{selectallproductorder}"><i class="fa fa-bell"></i>订单信息管理</a>
                                </li>
                            </ul>
                        </li>

                        <li class="has-sub">
                            <a class="js-arrow" href="#">
                                <i class="fa fa-edit (alias)"></i>生产计划管理</a>
                            <ul class="list-unstyled navbar__sub-list js-sub-list">
                                <li>
                                    <a th:href="@{selectallproductplan}"><i class="fa fa-edit (alias)"></i>计划信息管理</a>
                                </li>
                            </ul>
                        </li>

                        <li class="has-sub">
                            <a class="js-arrow" href="#">
                                <i class="fa fa-gavel"></i>生产调度管理</a>
                            <ul class="list-unstyled navbar__sub-list js-sub-list">
                                <li>
                                    <a th:href="@{selectallproductschedule}"><i class="fa fa-gavel"></i>调度信息管理</a>
                                </li>
                            </ul>
                        </li>
                    </ul>
                </nav>
            </div>
        </aside>
        <!-- END MENU SIDEBAR-->

        </div>
                <!-- PAGE CONTAINER-->
                    <div class="page-container">
            <!-- HEADER DESKTOP-->
            <header class="header-desktop">
                <div class="section__content section__content--p30">
                    <div class="container-fluid">
                        <div class="header-wrap">
                            <form class="form-header" action="" method="POST">
                                <input class="au-input au-input--xl" type="text" name="search" placeholder="Search for datas &amp; reports..." />
                                <button class="au-btn--submit" type="submit">
                                    <i class="zmdi zmdi-search"></i>
                                </button>
                            </form>
                            <div class="header-button">
                                <div class="account-wrap">
                                    <div class="account-item clearfix js-item-menu">
                                        <div class="content">
                                            <a class="js-acc-btn" href="#" th:text="${session.user.user_name}"></a>
                                        </div>
                                        <div class="account-dropdown js-dropdown">
                                            <div class="account-dropdown__footer">
                                                <a th:href="@{deletesession}">
                                                    <i class="zmdi zmdi-power"></i>Logout</a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </header>
            <!-- HEADER DESKTOP-->
                        <!-- MAIN CONTENT-->
                        <div class="main-content" style="background-color: #F8F8F8">

                            <div class="section__content section__content--p30">
                                <div class="container-fluid">
                                    <div class="row">
                                        <div class="col-md-7">
                                            <div class="card-body">
                                                <button type="button" class="btn btn-outline-primary"><a href="/selectallequipment">查询全部设备</a></button>
                                                <button type="button" class="btn btn-outline-primary"><a href="/equipmentinsert">新增设备</a></button>
                                            </div>
                                        </div>

                                        <form th:action="@{/selectequipmentbyname}" method="post" class="form-horizontal">
                                            <div class="input-group" style="position: relative; top: 19px;left: 200px;">
                                                <div class="input-group-btn">
                                                    <button class="btn btn-primary">
                                                        <i class="fa fa-search"></i> Search
                                                    </button>
                                                </div>
                                                <input type="text" id="equipment_name" name="equipment_name" placeholder="请输入设备名称" class="form-control">
                                            </div>
                                        </form>
                                    </div>

                                    <div class="row">
                                        <div class="col-md-12">
                                            <div class="card">
                                                <div class="card-header bg-secondary">
                                                    <strong class="card-title text-light">502畜牧养殖设备</strong>
                                                </div>
                                                <div class="card-body text-white bg-primary">
                                                    <p class="card-text text-light">养殖中心设备管理&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;-Product management of breeding center
                                                    </p>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>


                            <div class="section__content section__content--p30">
                                <div class="container-fluid">
                                    <div class="row">
                                        <div class="col-lg-12">
                                            <div class="table-responsive table--no-card m-b-30">
                                                <table class="table table-borderless table-striped table-earning">
                                                    <thead>
                                                        <tr>
                                                            <th>设备ID</th>
                                                            <th>设备名称</th>
                                                            <th>设备图片</th>
                                                            <th>设备状态</th>
                                                            <th>创建时间</th>
                                                            <th>更新时间</th>
                                                            <th>工厂ID</th>
                                                            <th>有效标识</th>
                                                            <th>操作</th>
                                                        </tr>
                                                    </thead>
                                                    <tbody>
                                                        <tr th:each="equipment:${pageInfo.list} ">
                                                            <td th:text="${equipment.id}"></td>
                                                            <td th:text="${equipment.equipment_name}"></td>
                                                            <td><img id="pic" th:src="${equipment.equipment_img_url}"></td>
                                                            <td th:if="${equipment.equipment_status eq 10}" th:text="启用" style="text-align: center"></td>
                                                            <td th:if="${equipment.equipment_status eq 20}" th:text="停用" style="text-align: center"></td>
                                                            <td th:if="${equipment.equipment_status eq 30}" th:text="故障" style="text-align: center"></td>
                                                            <td th:text="${#dates.format(equipment.create_time,'yyyy-MM-dd HH:mm:ss')}"></td>
                                                            <td th:text="${#dates.format(equipment.update_time,'yyyy-MM-dd HH:mm:ss')}"></td>
                                                            <td th:text="${equipment.factory_id}" style="text-align: center"></td>
                                                            <td th:text="${equipment.flag==0}?'无效':'有效'" style="text-align: center"></td>
                                                            <td>
                                                                <div class="table-data-feature">
                                                                <button class="item" data-toggle="tooltip" data-placement="top" title="Edit" >
                                                                    <a class="zmdi zmdi-edit" th:href="@{/selectequipmentbyid(id=${equipment.id})}"></a>
                                                                </button>
                                                                <button id="del" class="item" data-toggle="tooltip" data-placement="top" title="Delete" onclick="del()">
                                                                    <a class="zmdi zmdi-delete" th:href="@{/deleteequipmentbyid(id=${equipment.id})}"></a>
                                                                </button>
                                                                </div>
                                                            </td>
                                                        </tr>
                                                    </tbody>
                                                </table>



                                            </div>
                                            <span style="float: left;font-size: 16px;">
                                                    <span>共<span style="font-size: 19px;font-family: fantasy;color: cornflowerblue" th:text="${pageInfo.total}">&nbsp;</span>条记录,</span>
                                                    <span>当前显示第<span style="font-size: 19px;font-family: fantasy;color: cornflowerblue" th:text="${pageInfo.pageNum}"></span>页,</span>
                                                    <span>共<span style="font-size: 19px;font-family: fantasy;color: cornflowerblue"th:text="${pageInfo.pages}">&nbsp;</span>页</span>
                                                </span>

                                            <nav aria-label="Page navigation example">
                                                <ul class="pagination" style="margin-left: 275px;margin-top: -5px;">
                                                    <li th:if="${pageInfo.hasPreviousPage}" class="page-item">
                                                        <a class="page-link" th:href="@{/selectallequipment(currentPage=${pageInfo.pageNum-1})}" aria-label="Previous">
                                                            <span aria-hidden="true">&laquo;</span></a>
                                                    </li>

                                                    <li th:if="${pageInfo.hasPreviousPage == false}" class="page-item">
                                                        <a class="page-link" href="#">&laquo;</a>
                                                    </li>


                                                    <span th:each="page_num:${pageInfo.navigatepageNums}">

                                                                <li th:if="${page_num == pageInfo.pageNum}" class="page-item">
                                                                    <a class="page-link" href="#" th:text="${page_num}"></a>
                                                                </li>

                                                                <li th:if="${page_num != pageInfo.pageNum}" class="page-item">
                                                                    <a class="page-link" th:href="@{/selectallequipment(currentPage=${page_num})}" th:text="${page_num}"></a>
                                                                </li>
                                                        </span>


                                                    <li th:if="${pageInfo.hasNextPage}" class="page-item">
                                                        <a class="page-link" th:href="@{/selectallequipment(currentPage=${pageInfo.pageNum+1})}" aria-label="Next">
                                                            <span aria-hidden="true">&raquo;</span>
                                                        </a>
                                                    </li>

                                                    <li th:if="${pageInfo.hasNextPage == false}" class="page-item">
                                                        <a class="page-link" href="#">&raquo;</a>
                                                    </li>
                                                </ul>
                                            </nav>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>



    <script>
        function del() {
            var flag = confirm("确定删除吗？");
        }
    </script>

    <!-- Jquery JS-->
    <script th:src="@{vendor/jquery-3.2.1.min.js}"></script>
    <!-- Bootstrap JS-->
    <script th:src="@{vendor/bootstrap-4.1/popper.min.js}"></script>
    <script th:src="@{vendor/bootstrap-4.1/bootstrap.min.js}"></script>
    <!-- Vendor JS       -->
    <script th:src="@{vendor/slick/slick.min.js}">
    </script>
    <script th:src="@{vendor/wow/wow.min.js}"></script>
    <script th:src="@{vendor/animsition/animsition.min.js}"></script>
    <script th:src="@{vendor/bootstrap-progressbar/bootstrap-progressbar.min.js}">
    </script>
    <script th:src="@{vendor/counter-up/jquery.waypoints.min.js}"></script>
    <script th:src="@{vendor/counter-up/jquery.counterup.min.js}">
    </script>
    <script th:src="@{vendor/circle-progress/circle-progress.min.js}"></script>
    <script th:src="@{vendor/perfect-scrollbar/perfect-scrollbar.js}"></script>
    <script th:src="@{vendor/chartjs/Chart.bundle.min.js}"></script>
    <script th:src="@{vendor/select2/select2.min.js}">
    </script>

    <!-- Main JS-->
    <script th:src="@{js/main.js}"></script>

</body>
</html>